<template>
  <div id="upLoadUrl">
    <div  @click="openUrl" class="url-select" :style="{width:`${width+'px'}`}">
      <i v-if="v.url==''" class="el-icon-paperclip"></i>
      <span>{{v.url==''?'选择链接':(v.url.category+'-'+v.url.name.name)}}</span>
      <!-- <span v-if="v.url!=''">{{v.url.category}}-{{v.url.name.name}}</span> -->
    </div>
    <urlSelect ref="urlSelect" @getUrl='getUrl'></urlSelect>
  </div>
</template>

<script>
import urlSelect from '../../components/comm/urlSelect'
export default {
  name: "upLoadUrl",
  data() {
    return {

    };
  },
  props: ["v","width",'selectShow'],
  components: {
    urlSelect
  },
  computed: {},
  created() {
  },
  methods: {
    openUrl(i) {
      this.$refs["urlSelect"].cateShown= this.selectShow==undefined?[true,true,true,true,false]:this.selectShow;
      this.$refs["urlSelect"].isShown = true;
      this.$refs["urlSelect"].getMarketPage()
    },
    getUrl(url){
      this.v.url = url
    }
  },
};
</script>

<style lang="less" scoped>
@import url('../../assets/css/base.less');
#upLoadUrl{
  .url-select{
        width: 200px;
        border: 1px solid #dcdee2;
        background-color: #fff;
        padding:5px;
        border-radius: 4px;
        color: @mainColor;
        cursor: pointer;
      }
}
</style>
